<template>
    <div>
        <mt-header fixed :title="selected" v-show="this.$route.meta.showFooter">
            <router-link to="/" slot="left">
                <mt-button icon="back" @click="$router.back(-1)">返回</mt-button>
            </router-link>
            <mt-button icon="more" slot="right"></mt-button>
        </mt-header>

        <div>
            <router-view></router-view>
        </div>

        <mt-tabbar v-model="selected" v-show="this.$route.meta.showFooter">
            <mt-tab-item id="疫情查询">
                疫情查询
            </mt-tab-item>
            <mt-tab-item id="我的">
                我的
            </mt-tab-item>
        </mt-tabbar>
    </div>
</template>

<script>
    export default {
        name: "AppContent",
        data(){
            return {
                selected: '我的',
            }
        },
        watch:{
            selected(newval){
                switch (newval) {
                    case '疫情查询':
                        this.$router.push({
                            path: '/app/diseaseAbout'
                        })
                        this.selected = '疫情查询'
                        break
                    case '我的':
                        this.$router.push({
                            path: '/app/my'
                        })
                        this.selected = '我的'
                        break
                }
            }
        }
    }
</script>

<style scoped>

</style>